<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('汉典字显示')"/>
    <th:block th:include="include :: summernote-css"/>
    <style>
        .outer-box{
           display: flex;
        }

    body {
    padding: 0;
    margin: 0;
    font-family: "微软雅黑","Droid Sans";
}

strong,.dicpy,s,.py {
    font-size: 19px;
}

p,li {
    line-height: 1.6;
    letter-spacing: 1px;
    font-size: 16px;
    word-wrap: break-word;
    word-break: normal;
}

p.h {
    margin-bottom: 6px;
}
.h{
    margin-bottom: 14px;
}
p {
    margin:6px;

    /**margin-left:0px;**/
}

p.f {
}

strong {
    background: none repeat scroll 0 0 #ff3b30;
    color: #fff;
    margin: 0 5px 0 0;
    padding: 2px 0px;
}
.ft{
    background: #fff;
    color: #000;
    font-weight: lighter;
    font-size: 16px;
}

.py {
    font-weight: lighter;
    letter-spacing: 0px;
}

.dicpy,.dw_type,s,.py {
    color: #ff3b30;
}

.dw_en,.en {
    color: #ff9900;
    font-style: italic;
    letter-spacing: 1px;
    font-weight: lighter;
    font-size: 14px;
    font-family: "Microsoft YaHei","Segoe UI",Arial,Helvetica,sans-serif,SimSun;
}

.diczx1 {
        /*margin-left: 30px;*/
}

.dw_subline,.sub,.sub2,.subcz {
    color: #807e7e;
    padding-left: 50px;
    margin: 10px 0px;
    font-size: 14px;
    line-height: 1.5;
    font-weight: lighter;
/*text-shadow:0 0 2px #efefef;*/
}



hr {
    color: #ebebeb;
    border: 0px;
    border-top: 1px solid #ebebeb;
}

h2 {
    /*background: #ebebeb;*/
    border-bottom: 1px solid #f6f6f6;
    border-top: 10px solid #f6f6f6;
    color: #7e7e7e;
    padding: 8px 0px 8px 15px;
    font-size: 13px;
    font-weight: 100;
}

strong.nolight {
    background: none;
    color: #000;
}

li {
    list-style: outside  decimal;
    margin-left: 40px;
    margin-top: 17px;
}
.sub {
    padding-left: 40px;
}
.sub2{
    padding-left: 40px;
}
span.note {
    margin-left: -32px;
    padding-right: 13px;
    display:none;
}
/*成语*/
.ins{
    text-indent: 2.2em;
}
.nred{
    padding: 0px 5px;
    background: #fd7068;
    color: #fff;
    border-radius: 10px;
    position: absolute;
    font-size: 12px;
    left: 1px;
    margin-top: 3px;
    line-height: 1.4;
}
/**词语*/
.ncz{
    padding-right: 7px;
}
.subcz{
    padding-left:64px;
}

ul li:first-child {
    margin-top: 0;
}

ul {
    margin: 0;
    padding: 0;
}

i {
    color: #8c8c8c;
    display: list-item;
    list-style-type: circle;
    list-style-position: inside;
    margin-left: 16px;
}

b {
    color: #25bbc3;
    font-weight: lighter;
}

b.attr {
    background: #25bbc3;
    color: #fff;
    border-radius: 50;/*低版本浏览器不支持百分比*/
    margin: 18px 0 -1 7px;
    height: 20px;
    display: inline-block;
    text-align: center;
    line-height: 20px;
    /*overflow: hidden;*/
    position: relative;
    bottom: 2px;
    font-size: 12;
    font-weight: lighter;
    padding: 0 4px;
}
.f .attr{
    margin-top:0;
}


u,s,i,b {
    font-style: normal;
    text-decoration: none;
}

u {
    text-decoration: none;
    display: block;
    font-style: normal;
    color: #000;
}

code {
    color: #33a3a4;
}

em {
    color: #ff3b30;
}

b.num {
    color: #bd010f;
    font-weight: bold;
    position: absolute;
    margin: 2px 0 0 0;
}
.num{
    color: #bd010f;
}

ul {
    color: #bd010f;
}
span.num{
    display:inline;
}
.zy{
    background: #25bbc3;
    color: #fff;
    border-radius: 10;
    font-size: 12;
    padding: 0px 2px;
    position: relative;
    bottom: 1px;
}
li .sub{/*li内的sub继承左边距,kangxi*/
    padding-left:inherit;
}
/**外研社样式**/
 .wyslg{
vertical-align: middle;display:inline-block;background-size:20px;
width:20px;height: 20px;position: relative;margin-right:3px;
background-repeat: no-repeat;
background-image:url('');
}
.wys{color:#aaa;font-size:14px;margin-bottom:4px;}
.wys zi:after{vertical-align: middle;content:'本解释来源于外研社规范字典';}
.wys ci:after{vertical-align: middle;content:'本解释来源于外研社汉语词典';}
.r{text-align:right;}
h2 cd:after{content:'汉语词典';}
/** 外研社END **/
/** 词组特殊的部分 */
p,.sub{
    margin-left:5px;
    padding-right:10px;
}
p{
    padding: 0 8px;
}
.nred{
    left:5px;
}
h2 {
   margin-top:0px;
   color:#B8B8B8;
   font-size:16px;
}
.subcz{
    padding-left:45px;
}
.ncz{
position: absolute;
margin-left:-22px;
}

/** end cizu view3 **/
/** 这个在线样式为了测试 */
a {
  color: #39f;
  border-bottom: 1px dashed #39f;
  text-decoration:none;
}
a.view{
  border-bottom: 0px;
}
</style>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <div class="outer-box">
        <div style="padding: 0 20px;" xtra:strip-whitespace="deep">
            <div th:each="item:${gycdJson}" th:remove="tag">
                <div th:each="sub_item:${item.items}" th:remove="tag">
                <p class=f><span class=py th:text="${item.py}"></span><b class="attr" th:text="${sub_item.attr}"></b></p>
                <ul>
                    <div th:each="explain:${sub_item.explains}" th:remove="tag">
                        <li>
                            <u th:text="${explain.explain}"></u>
                            <span th:each="example:${explain.examples}" th:remove="tag">
                            <p class="sub" th:text="${example}">/p>
                            </span>
                            <span th:each="quote:${explain.quotes}" th:remove="tag">
                            <p class="sub" th:text="${quote}">/p>
                            </span>
                        </li>
                  </div>
                </ul>
        </div>
    </div>
</div>
</div>
</body>
</html>